<!-- 图标认证页面 -->
<template>
	<view class="authentication">
		<view class="icon-content">
			<buildForm v-if="formLoading" :formItems="formItems" :select_city_new="[]" :select_city_newd="[]"
				:value="form" @input="formInput" />
			<view class="button">
				<u-button class="submit" hover-class="none" type="primary" @click="subForm">
					{{ $t('提交申请') }}
				</u-button>
			</view>
		</view>
		<Permission></Permission>

	</view>
</template>

<script>
	import buildForm from "@/components/buildForm/index.vue"
	import {
		mapForm
	} from 'pages/release/buildFormItems.js'
	import {
		icon
	} from './icon.js'
	import Permission from "@/components/Permission.vue"

	export default {
		data() {
			return {
				id: 0,
				form: {},
				formItems: [],
				formLoading: false, // 加载完成后再引入组件
			};
		},
		components: {
			buildForm,
			Permission
		},
		onLoad(options) {
			this.id = options.id
			this.formItems = icon
			mapForm(this.formItems, this.id).then(res => {
				res.icon_id = options.id
				this.form = res
				this.formLoading = true
				console.log(this.formItems);
			})
		},
		onReady() {
			uni.setNavigationBarTitle({
				title: this.$t("图标认证")
			})
		},
		methods: {
			subForm() {
				const that = this
				uni.showLoading({
					title: "Loading...",
					mask: true
				})
				that.$u.api.user.createIconAuth(that.form).then(res => {
					uni.hideLoading();
					this.$u.toast(this.$t('提交成功，请等待后台审核'))
					setTimeout(() => {
						that.$u.route({
							url: '/pages/tabbar/user/index',
							type: 'switchTab'
						})
					}, 3000)
				}).catch(err => {
					console.log('err', err)
					this.$u.toast(this.$t(err.data.msg))
					return false;
					// setTimeout(() => {
					//   that.$u.route({
					//     url: '/pages/tabbar/user/index',
					//     type: 'switchTab'
					//   })
					// }, 3000)
				})
			},
			formInput(val) {
				this.form = val
			}
		}
	}
</script>

<style lang="scss" scoped>
	.submit {
		width: 602rpx;
		height: 90rpx;
		border-radius: 16rpx;
		background: #000000;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.authentication {
		padding: 30rpx 30rpx 64rpx 30rpx;
		background: #f6f6f6;
		// overflow: scroll;

	}

	.icon-content {
		height: 100%;
		background: #ffffff;
		border-radius: 15rpx;
		display: flex;
		flex-direction: column;
	}

	.button {
		flex: 1;
		display: flex;
		align-items: flex-end;
		justify-content: center;
		padding-bottom: 26rpx;
	}
</style>